KeyboardAvoidingView not working properly with flatList and textInput · Issue #37270 · facebook/react

I have used flatList's footerComponent to render textInput. and I wanted automatic scroll feature on textInput focus so I used KeyboardAvoidingView. but Keyboard automatically closing in android in this scenario. this issue is specific to android, on ios its working as expected

0.70.5

warn Package @sentry/react-native contains invalid configuration: "dependency.platforms.ios.sharedLibraries" is not allowed,"dependency.hooks" is not allowed. Please verify it's properly linked using "react-native config" command and contact the package maintainers about this. info Fetching system and libraries information... System: OS: Linux 5.19 Ubuntu 22.04.2 LTS 22.04.2 LTS (Jammy Jellyfish) CPU: (4) x64 Intel(R) Core(TM) i5-6300U CPU @ 2.40GHz Memory: 1.43 GB / 15.52 GB Shell: 5.1.16 - /bin/bash Binaries: Node: 16.20.0 - ~/.nvm/versions/node/v16.20.0/bin/node Yarn: 1.22.19 - /usr/bin/yarn npm: 8.19.4 - ~/.nvm/versions/node/v16.20.0/bin/npm Watchman: Not Found SDKs: Android SDK: Not Found IDEs: Android Studio: Not Found Languages: Java: 11.0.18 - /usr/bin/javac npmPackages: @react-native-community/cli: Not Found react: 18.2.0 => 18.2.0 react-native: 0.70.5 => 0.70.5 npmGlobalPackages: react-native: Not Found

I have given the expo link which has running code. when I change something from styles then it again working fine.

expo link: https://snack.expo.dev/@sagarahir/flatlist-simple

code: import React from 'react'; import { View, KeyboardAvoidingView, TextInput, StyleSheet, Text, Platform, FlatList, } from 'react-native';

const DATA = [ { id: 'bd7acbea-c1b1-46c2-aed5-3ad53abb28ba', title: 'First Item', }, { id: '3ac68afc-c605-48d3-a4f8-fbd91aa97f63', title: 'Second Item', }, { id: '58694a0f-3da1-471f-bd96-145571e29d72', title: 'Third Item', }, ];

type ItemProps = { title: string };

const Item = ({ title }: ItemProps) => (

{title}

);

const KeyboardAvoidingComponent = () => { return ( } keyExtractor={(item) => item.id} ListFooterComponent={() => (

)} />

); };

const styles = StyleSheet.create({ container: { flex: 1, }, textInput: { height: 41, borderColor: '#000000', borderBottomWidth: 1, marginBottom: 36, marginTop: 350, }, item: { backgroundColor: '#f9c2ff', padding: 20, marginVertical: 8, marginHorizontal: 16, }, title: { fontSize: 32, }, });

export default KeyboardAvoidingComponent;